.team-overview-card {
	position: relative;
	z-index: 0;
	background-color: transparent;
	transform-origin: center center;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
	container-type: inline-size;
}

	.team-overview-card::before {
		content: "";
		position: absolute;
		inset: 0;
		background-color: var(--bs-gray-200);
		border-radius: inherit;
		transition: transform 0.15s ease, background-color 0.3s ease;
		transform-origin: left center;
		z-index: -1;
	}

.team-overview-inner {
	background-color: transparent;
}

.team-overview-social {
	position: relative;
	z-index: 2;
	color: var(--bs-dark);
	transition: color 0.3s ease, transform 0.15s ease;
}

.team-overview-media {
	width: 250px;
	min-width: 250px;
	max-width: 250px;
}

.team-overview-img {
	filter: grayscale(100%);
	transition: filter 0.3s ease;
}

@media (hover: hover) {
	.team-overview-card:hover {
		transform: translateX(-4%);
	}

		.team-overview-card:hover::before {
			background-color: var(--team-overview-hover-background, var(--bs-warning));
			transform: scaleX(1.08);
		}

	.team-overview-card.team-overview-card-lift:hover {
		transform: translateX(-4%) translateY(-7px);
	}

	.team-overview-card:hover .team-overview-img {
		filter: grayscale(0%);
	}

	.team-overview-card:hover .team-overview-body,
	.team-overview-card:hover .team-overview-title,
	.team-overview-card:hover .team-overview-subtitle,
	.team-overview-card:hover .team-overview-description,
	.team-overview-card:hover .team-overview-social {
		color: var(--bs-white) !important;
	}

	.team-overview-card:hover .team-overview-name {
		color: var(--team-overview-hover-title, var(--bs-white)) !important;
	}

	.team-overview-card:hover .team-overview-social {
		transform: translateX(8cqi);
	}
}

@media (max-width: 767.98px) {
	.team-overview-inner {
		flex-direction: column;
	}

	.team-overview-media {
		width: 100%;
		min-width: 0;
		max-width: 100%;
		border-top-right-radius: var(--bs-border-radius-lg);
		border-bottom-left-radius: 0;
	}

	.team-overview-img {
		filter: grayscale(0%);
	}

	.team-overview-name,
	.team-overview-social {
		padding-top: 10px;
	}

	.team-overview-description {
		padding-bottom: 10px;
	}
}